<template>
	<view style="height: 100vh; background-color: #FFFFFF;">
		<!-- 领取到任务的，修改任务状态 -->
		<u-navbar title-color="#FFFFFF" height="48" back-icon-color="#FFFFFF" :border-bottom="false" :is-fixed="true"
			:title="'任务详情'"></u-navbar>
		<uc-content :loading="loading">
			<view class="list-item">
				<view class="list-bottom">
					<view>任务名称:</view>
					<view>{{enterpriseTaskInfo.name}}</view>
				</view>
			</view>
			<view class="list-item">
				<view class="list-bottom">
					<view>负责区域:</view>
					<view>{{enterpriseTaskInfo.regionName}}</view>
				</view>
			</view>
			<view class="list-item">
				<view class="list-bottom">
					<view>任务内容:</view>
					<view>{{enterpriseTaskInfo.content}}</view>
				</view>
			</view>
			<view class="list-item">
				<view class="list-bottom">
					<view>任务类型:</view>
					<view>{{enterpriseTaskInfo.type|type}}</view>
				</view>
			</view>
			<view class="list-item">
				<view class="list-bottom">
					<view>开始时间:</view>
					<view>{{enterpriseTaskInfo.startTime|taskDate}}</view>
				</view>
			</view>
			<view class="list-item">
				<view class="list-bottom">
					<view>结束时间:</view>
					<view>{{enterpriseTaskInfo.endTime|taskDate}}</view>
				</view>
			</view>
			<u-button @click="taskReturn(enterpriseTaskInfo.ucId)" type="error" style=" margin-top: 10px"
				v-if="enterpriseTaskInfo.status==1">退回任务</u-button>
			<u-button @click="taskChange(enterpriseTaskInfo.ucId)" type="primary" style=" margin-top: 10px"
				v-if="enterpriseTaskInfo.status==1">交班</u-button>
			<!--具体巡检次数-->
			<view style=" margin-top: 10px">
				<view class="list-item" v-for="(item,index) in taskList" :key="index">
					<u-row>
						<u-col span="7">
							<view class="list-top ">
								<view class="list-left">第{{ index+1 }}次巡检</view>
							</view>
							<view class="list-center u-line-3">
								<view>开始时间:{{item.startTimeStr}}</view>
								<view>结束时间:{{item.endTimeStr}}</view>
							</view>
						</u-col>
						<u-col span="5">
							<view class="inspection">
								<u-button @click="Inspection(item,index)" style=" margin-bottom: 10px" type="primary"
									size="medium" :disabled="item.status==1">开始巡检</u-button>
								<u-button @click="uploadPic(item,index)" type="primary" size="medium">巡检照片</u-button>
							</view>
						</u-col>
					</u-row>
				</view>
			</view>
			<view>
				<u-toast ref="uToast" />
			</view>
			<view>
				<u-popup mode="bottom" height="50%" closeable v-model="imageShow">
					<view style="margin-top: 40rpx;margin-bottom: 40rpx;">
						<u-image height="500rpx" :src="imgUrl+'?x-oss-process=style/zip_app'" mode="aspectFit">
							<u-loading slot="loading"></u-loading>
						</u-image>
					</view>
					<view>
						<u-row gutter="16">
							<u-col span="6" style="text-align: center;">
								<u-button type="success" size="medium" @click="addPatrolImage">图片上传</u-button>
							</u-col>
							<u-col span="6" style="text-align: center;">
								<u-button type="primary" size="medium" @click="hiddenShow=true">隐患上报</u-button>
							</u-col>
						</u-row>
					</view>
				</u-popup>
			</view>
			<view>
				<u-popup mode="bottom" height="50%" closeable v-model="hiddenShow">
					<u-form :model="hiddenDanger" ref="hiddenDangerRef" label-width="100px"
						style="padding: 24rpx;margin-top: 60rpx;margin-left: 20rpx;margin-bottom: 40rpx;">
						<u-form-item label-position="left" label="隐患名称" prop="name">
							<u-input type="text" :border="border" placeholder="请输入隐患名称" v-model="hiddenDanger.name" />
						</u-form-item>
						<u-form-item label-position="left" label="隐患地点" prop="address">
							<u-input type="text" :border="border" placeholder="请输入详细的隐患地点"
								v-model="hiddenDanger.address" />
						</u-form-item>
						<u-form-item label-position="left" label="隐患描述" prop="remark">
							<u-input type="text" :border="border" placeholder="请输入具体情况描述"
								v-model="hiddenDanger.remark" />
						</u-form-item>
					</u-form>
					<view>
						<u-button style="margin-left: 30%;" type="primary" size="medium" @click="addHiddenDanger">确定
						</u-button>
					</view>
				</u-popup>
			</view>
			<!-- <view>
				<u-popup mode="bottom" height="50%" closeable v-model="changeShow">
					<u-form :model="hiddenDanger" ref="hiddenDangerRef" label-width="100px"
						style="padding: 24rpx;margin-top: 60rpx;margin-left: 20rpx;margin-bottom: 40rpx;">
						<u-form-item label-position="left" label="接班人" prop="name">
							<u-input type="text" :border="border" placeholder="请选择接班人" v-model="hiddenDanger.executor" />
							<u-picker :show="show" :columns="columns" keyName="label" @change="changeHandler"></u-picker>
						</u-form-item>
					</u-form>
					<view>
						<u-button style="margin-left: 30%;" type="primary" size="medium" @click="taskChange(enterpriseTaskInfo.ucId)">确定
						</u-button>
					</view>
				</u-popup>
			</view> -->
		</uc-content>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				enterpriseTaskInfo: {},
				taskId: "",
				taskList: [],
				loading: false,
				//巡检类型的间隔时间时间戳
				space: 0,
				taskType: 0,
				imageShow: false,
				imgUrl: "",
				patrolInfoId: null,
				hiddenDanger: {
					taskId: null,
					abnormalPic: null,
					remark: null,
					address: null
				},
				hiddenShow: false
			}
		},
		onLoad(e) {
			this.taskId = e.ucId
		},
		onShow() {
			this.initView(this.taskId)
		},
		methods: {
			// changeHandler(){
				
			// },
			addPatrolImage() {
				this.utils.request("/api/app/enterpriseTask/addPatrolImage", {
					patrolInfoId: this.patrolInfoId,
					imgUrl: this.imgUrl
				}, "post", "app", true).then(resp => {
					this.$refs.uToast.show({
						title: '图片上传成功！',
						type: 'success'
					})
					this.imageShow = false
				}).catch(error => {
					this.$refs.uToast.show({
						title: '图片上传失败！',
						type: 'error'
					})
				})
			},
			addHiddenDanger() {
				if(!this.addDangerValidate()) return
				this.hiddenDanger.taskId = this.taskId
				this.hiddenDanger.abnormalPic = this.imgUrl
				this.utils.request("/api/app/inHiddenDanger/addInHiddenDanger", this.hiddenDanger, "post", "app",
						true)
					.then(res => {
						this.$refs.uToast.show({
							title: '隐患上报成功！',
							type: 'success'
						})
						this.hiddenShow = false
						this.imageShow = false
					}).catch(error => {
						this.$refs.uToast.show({
							title: '隐患上报失败！',
							type: 'error'
						})
					})
			},
			addDangerValidate(){
				if(this.hiddenDanger.name==null || this.hiddenDanger.address==null
				|| this.hiddenDanger.remark==null){
					this.$refs.uToast.show({
						title: '请完成隐患信息录入！',
						type: 'error'
					})
					return false
				}
				return true
			},
			initView(val) {
				this.loading = true
				this.taskList = []
				this.enterpriseTaskInfo = {}
				this.getInEnterpriseTaskVo(val)
			},
			getPatrolSpace() {
				this.utils.request("/api/app/enterpriseTask/getPatrolSpace", {
					taskType: this.taskType
				}, "post", "app", true).then(res => {
					this.space = res.data
					// console.log(this.space)
				}).catch(error => {
					console.log(error)
				})
			},
			getInEnterpriseTaskVo(val) {
				this.utils.request("/api/app/enterpriseTask/getInEnterpriseTaskVo", {
					ucId: val
				}, "post", "app", true).then(res => {
					this.loading = false
					this.enterpriseTaskInfo = res.data
					this.taskList = res.data.taskInfoVos
					this.taskType = res.data.type
					this.getPatrolSpace()
				}).catch(error => {
					this.loading = false
					console.log(error)
				})
			},
			Inspection(item, index) {
				//判断巡检间隔是否达到要求
				if (!this.vaildExecute(item, index)) return
				//获取地址信息上传内容
				window.native.getLocation(res => {
					this.utils.request("/api/admin/user/reportUserLocation", {
						location: res.data.addr,
						longitude: res.data.longitude,
						latitude: res.data.latitude
					}, "post", "app", true).then(res => {
						console.log(res)
					}).catch(error => {
						console.log(error)
					})
				})
				this.addInspectionTaskLog(this.enterpriseTaskInfo.ucId, item.ucId)
				// let userInfo = this.$store.getters.userInfo
			},
			uploadPic(item, index) {
				//判断巡检间隔是否达到要求
				if (!this.vaildExecute(item, index)) return
				window.native.h5Camera()
				window.native.getUri(res => {
					if (res.uri) {
						this.imgUrl = res.uri
						this.patrolInfoId = item.ucId
						this.imageShow = true
					}
				})
			},
			//判断是否满足执行要求
			vaildExecute(item, index) {
				//判断当前是否在规定时间范围内
				let nowTime = new Date().getTime()
				if (item.startTime && item.endTime) {
					// let startDate  = item.startTime.getTime()
					// let endDate  = item.endTime.getTime()
					let startTime = new Date(item.startTime).getTime()
					let endTime = new Date(item.endTime).getTime()
					if (nowTime < startTime || nowTime > endTime) {
						this.$refs.uToast.show({
							title: '未到规定时间，不能巡检！',
							type: 'error'
						})
						return false
					}
				}
				if (index > 0) {
					//获取上一次执行记录的执行时间
					let lastExecuteTime = this.taskList[index - 1].executeTime
					if (lastExecuteTime) {
						let executeDate = new Date(lastExecuteTime.replace(/-/, "/"))
						let lastExecuteTimeValue = executeDate.getTime()
						//判断是否超过要求的时间
						if (nowTime - lastExecuteTimeValue < this.space) {
							this.$refs.uToast.show({
								title: '间隔时间太短，不能巡检！',
								type: 'error'
							})
							return false
						}
					}
				}
				return true
			},
			addInspectionTaskLog(ucId, val) {
				this.utils.request("/api/app/enterpriseTask/addInsepectionTaskLog", {
					taskId: ucId,
					taskInfoId: val
				}, "post", "app", true).then(res => {
					this.logId = res.data
					window.native.rounds({
						ucId: this.logId,
						title: ucId
					})
					this.updateTaskInfo(val)
				}).catch(error => {
					console.log(error)
				})
			},
			updateTaskInfo(val) {
				this.utils.request("/api/app/enterpriseTask/updateTaskInfo", {
					ucId: val
				}, "post", "app", true).then(res => {
					console.log(res.data)
				}).catch(error => {
					console.log(error)
				})
			},
			taskReturn(val) {
				this.utils.request("/api/app/task/taskReturn", {
					ucId: val
				}, "post", "app", true).then(res => {
					uni.navigateBack()
				}).catch(error => {
					console.log(error)
				})
			},
			taskChange(val) {
				this.utils.request("/api/app/task/taskChange", {
					ucId: val
				}, "post", "app", true).then(res => {
					uni.navigateBack()
				}).catch(error => {
					console.log(error)
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	@import "../../../uview-ui/libs/css/style.components.scss";

	.list-item {
		padding: 30rpx 40rpx;
		background-color: #fff;
		border-bottom: #999999 1px solid;

		.list-top {
			@include vue-flex;
			justify-content: space-between;
			align-items: center;

			.list-left {
				font-weight: bold;
				font-size: 34rpx;
			}

			.list-right {
				font-size: 30rpx;
				line-height: 34rpx;
				color: #999999;
			}
		}

		.list-center {
			margin-top: 20rpx;
			font-size: 28rpx;
			color: #999999;
		}

		.list-bottom {
			display: flex;
			margin-top: 20rpx;
			font-size: 28rpx;
			justify-content: space-between;
			color: #999999;
		}

		.inspection {
			margin-right: 10rpx;
			margin-bottom: 10rpx;
		}
	}
</style>
